<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<style type="text/css">
		body {
			/*background: black;*/
		}
		.wrapper {
			width: 400px;
			height: 500px;
			border: 1px solid;
			overflow: auto;
			background: #aaa;
			
		}
		.inner {
			width: 300px;
			height: 600px;
			background: #ccc;
		}
		/*.wrapper::-webkit-scrollbar-track-piece{width:10px;background-color:#4e4e5a ;  }
		.wrapper::-webkit-scrollbar{width:22px; }
		.wrapper::-webkit-scrollbar-thumb{background:#666;   }*/
		/*.wrapper::-webkit-scrollbar-thumb:hover{background:#3fb560 ;}*/
		::-webkit-scrollbar  
{  
    width: 20px;  
    height: 16px;  
    background-color: #F5F5F5;  
}  
  
/*定义滚动条轨道 内阴影+圆角*/  
::-webkit-scrollbar-track  
{  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  
    border-radius: 10px;  
    background-color: transparent;  
}  
  
/*定义滑块 内阴影+圆角*/  
::-webkit-scrollbar-thumb  
{  
    border-radius: 10px;  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);  
    background-color: #555;  
}  

	</style>
	<body>
		<div class="wrapper">
	    	<div class="inner"></div>
	    </div>
	</body>
</html>
